<#assign pageTitle="收货地址"/>
<#assign pageHeader>
    <link rel="stylesheet" type="text/css" href="/static/h5/css/user.css?20220210"/>
</#assign>
<#assign pageContent>
    <van-nav-bar
            title="收货地址"
            left-text="返回"
            left-arrow
            @click-left="location.href='/user/index.html';"
            fixed
            placeholder
    ></van-nav-bar>
    <van-address-edit
            :area-list="areaList"
            show-postal
            show-delete
            show-set-default
            show-search-result
            :search-result="searchResult"
            :area-columns-placeholder="['请选择', '请选择', '请选择']"
            @save="onSave"
            @delete="onDelete"
            @change-detail="onChangeDetail"
    />
</#assign>
<#assign pageScript>
    <script>
        new Vue({
            el: '#app',
            data() {
                return {
                    areaList:{
                        province_list: {
                            110000: '北京市',
                            120000: '天津市',
                        },
                        city_list: {
                            110100: '北京市',
                            120100: '天津市',
                        },
                        county_list: {
                            110101: '东城区',
                            110102: '西城区',
                            // ....
                        },
                    },
                    searchResult: [],
                }
            },
            created() {
            },
            methods: {
                formatter(type, val) {
                    if (type === 'year') {
                        return val + '年';
                    }
                    if (type === 'month') {
                        return val + '月';
                    }
                    if (type === 'day') {
                        return val + '日';
                    }
                    return val;
                },
                onSubmit(values) {
                    var that = this;
                    this.$dialog.confirm({
                        title: '确认提交吗？',
                    }).then(() => {
                        let data = new FormData();
                        data.append("fullName", values.fullName);
                        data.append("email", values.email);
                        data.append("birthday", values.birthday);
                        data.append("gender", values.gender);
                        data.append("career", values.career);
                        data.append("areaId", that.user.areaId);
                        axios.post('/user/set/save.json', data).then(function (response) {
                            if (response.data.code === 0) {
                                that.$dialog.alert({
                                    title: '提交成功',
                                }).then(() => {
                                    window.location.reload()
                                });
                            } else {
                                that.$toast.fail({
                                    message: response.data.msg,
                                    duration:3000
                                });
                            }
                        }).catch(function (error) {
                            that.$toast.fail(error);
                        });
                    }).catch(() => {
                        // on cancel
                    });

                },
                onSave() {
                    Toast('save');
                },
                onDelete() {
                    Toast('delete');
                },
                onChangeDetail(val) {
                    if (val) {
                        this.searchResult = [
                            {
                                name: '黄龙万科中心',
                                address: '杭州市西湖区',
                            },
                        ];
                    } else {
                        this.searchResult = [];
                    }
                },
            },

        });
    </script>
</#assign>
<#include "../layout_h5.ftl" />